<template>
  <router-view />
  <!-- <router-view v-slot="{ Component }">
    <transition>
      <keep-alive>
        <component :is="Component" />
      </keep-alive>
    </transition>
  </router-view> -->

  <div id="nav">
    <router-link to="/"
      ><div class="tab-bar-item"><i class="iconfont icon-gouwuche"></i></div>
      <div>首页</div></router-link
    >
    <router-link to="/category"
      ><div class="tab-bar-item"><i class="iconfont icon-fenlei"></i></div>
      <div>分类</div></router-link
    >
    <router-link to="/shopcart">
      <div class="tab-bar-item">
        <van-badge :content="$store.state.cartCount" max="9">
          <i class="iconfont icon-shouye"></i>
        </van-badge>
      </div>
      <div>购物车</div></router-link
    >
    <router-link to="/profile"
      ><div class="tab-bar-item"><i class="iconfont icon-yonghu"></i></div>
      <div>我的</div></router-link
    >
  </div>
</template>
<script>
import {onMounted} from 'vue'
import {useStore} from 'vuex'
export default {
  setup() {
    const store=useStore()
      onMounted(()=>{
        store.dispatch('updateCart')
      })
  },
}
</script>
<style lang="less" scoped>
@import "assets/css/base.css";
</style>
